<template>
  <div>
    <el-dialog
      title='修改发送时间'
      :close-on-click-modal="false"
       width="540px"
      :visible.sync="this.dialogVisible"
      append-to-body
      :before-close="handleClose"
      >
      <el-form  label-width="150px" :rules="rules" :model="ruleForm"  ref="ruleForm" >
        <el-form-item label="原始发送时间:" >
          <el-date-picker
            v-model="ruleForm.timeOld"
            type="datetime"
            disabled
            placeholder="选择日期时间"
            default-time="12:00:00">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="修改发送时间:" prop="timeNew" >
          <el-date-picker
            v-model="ruleForm.timeNew"
            type="datetime"
            :picker-options="pickerOptions"
            value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间"
            default-time="00:00:00">
          </el-date-picker>
        </el-form-item>
      </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="handleClose()">取 消</el-button>
      <el-button type="primary" @click="submitEditTimingTransmission('ruleForm')">确 定</el-button>
    </span>
    </el-dialog>
  </div>
</template>

<script>
import { postAction } from '@/api/common'
import { parseTime } from '@/utils'
export default {
  name: 'AddGroup',
  props: {
    show: {
      type: Boolean,
      default: false
    },
    timingTransmission: {
      type: String,
      default: '2021-01-01 00:00:00'
    },
    id: {
      Type: Number,
      default: 0
    }
  },
  components: {
  },
  watch: {
    show() {
      this.dialogVisible = this.show
    },
    id() {
      this.ruleForm.id = this.id
    },
    timingTransmission() {
      this.ruleForm.timeOld = this.timingTransmission
    }
  },
  data: function() {
    return {
      timeNow: parseTime(new Date()),
      ruleForm: {
        timeOld: '',
        timeNew: parseTime(new Date()),
        id: 0
      },
      groupId: null,
      tableData: [],
      options: [],
      dialogVisible: this.show,
      rules: {
        timeNew: [
          { required: true, message: '请选择修改发送时间', trigger: 'blur' }
        ]
      },
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < Date.now()
        }
      }
    }
  },
  methods: {
    handleClick(row) {
      console.log(row)
    },
    getInit() {
      // getAction({}, 'EmailConfigGroup/GetGroupList')
      //   .then((res) => {
      //     this.options = res.data
      //   })
    },
    handleClose() {
      this.resetForm('ruleForm')
      this.$emit('update:show', false)
    },
    submitEditTimingTransmission(formName) {
      if (Date.parse(this.ruleForm.timeNew) - Date.now() < 5 * 60) {
        this.$confirm('当 前 提 交 时 间 过 近 或 小 于 当 前 时 间 , 如 果 此 任 务 已 提 交 , 确 定 后 将 立 即 发 送，确 定 执 行 此 操 作 吗 ？', '提示', {
          confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning'
        }).then(() => {
          this.doSubmit(formName)
        })
      } else {
        this.doSubmit(formName)
      }
    },
    doSubmit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          console.log(this.ruleForm)
          postAction(this.ruleForm, 'EmailMarketing/EditTimingTransmission')
            .then((res) => {
              if (res.code === 20000) {
                this.$message({
                  message: '修改发送时间成功!',
                  type: 'success'
                })
                this.handleClose(false)
                this.$emit('closeAction')
              } else {
                this.$message({
                  message: res.msg,
                  type: 'warning'
                })
              }
            })
        } else {
          return false
        }
      })
    },
    resetForm(formName) {
      this.$refs[formName].resetFields()
    }
  }
}
</script>

<style scoped>

</style>
